import { List } from 'antd';
import { FC, useEffect } from 'react';
import { useSelector, useDispatch } from 'umi';

const TodolistFrom: FC = () => {
  const list = useSelector((state: any) => state.todolist.list);
  const dispatch = useDispatch();

  const handleClick = (item: string) => () => {
    dispatch({ type: 'todolist/removelist', item: item });
  };

  // useEffect(() => {
  //   dispatch({
  //     type: 'todolist/getTodolistAsync',
  //   });
  // }, []);

  return (
    <List
      size="small"
      bordered
      dataSource={list}
      renderItem={(item: string) => (
        <List.Item onClick={handleClick(item)}>{item}</List.Item>
      )}
    />
  );
};

export default TodolistFrom;
